<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>postMessageDemo</title>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui@2.5.4/lib/theme-chalk/index.css"> 
</head>
<body>
    <div id="app">
        <el-button type="text" @click="getDateTime">获取当前时间</el-button>
    </div>
</body>
<!-- 引入组件库 -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/element-ui@2.5.4/lib/index.js"></script>
<script type="text/javascript">
    new Vue({
        el: '#app',
        data() {
            return { 
                worker: null,
            }
        },
        created () {
            let self = this;
            this.worker = new Worker('test.worker.js');
            this.worker.onmessage = function (event) {
                let data = event.data;
                self.$alert(JSON.stringify(data));
            }
        },
        methods: {
            getDateTime () {
                this.worker.postMessage({ cmd: 'time' });
            }
        }
    })
</script>

</html>